/*
 * Copyright 2010 Nicolas Lochet Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. You may obtain a copy of the License at
 * 
 * http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software distributed under the License is
 * distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and limitations under the License.
 */
package org.nicocube.wol.game.client.ui;

import com.google.gwt.dom.client.ImageElement;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.ui.AbsolutePanel;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.DecoratorPanel;
import com.google.gwt.widgetideas.graphics.client.GWTCanvas;
import com.google.gwt.widgetideas.graphics.client.ImageLoader;

public class AppearancePanel extends Composite {
	private AbsolutePanel ap;
	private DecoratorPanel dp;
	
	int hairIndex;
	int eyebrowsIndex;
	int makeupIndex;
	int eyesIndex;
	int mouthIndex;

	public AppearancePanel() {
		dp = new DecoratorPanel();
		ap = new AbsolutePanel();
		initWidget(ap);
	}

	@Override
	protected void onLoad() {
		ap.setPixelSize(800, 500);
		
		final GWTCanvas canvas = new GWTCanvas(400,400);
		canvas.setPixelSize(400, 400);
		
		String[] urls = new String[] {"../resource/visages00.png"};

		ImageLoader.loadImages(urls, new ImageLoader.CallBack() {

			@Override
			public void onImagesLoaded(ImageElement[] imageElements) {
				final ImageElement img0 = imageElements[0];

				hairIndex = 0;
				eyebrowsIndex = 0;
				makeupIndex = 0;
				eyesIndex = 0;
				mouthIndex = 0;
				
				showFace(canvas, img0);

				Button b0 = new Button("hair");
				b0.addClickHandler(new ClickHandler() {
					@Override
					public void onClick(ClickEvent event) {
						hairIndex = (hairIndex+1)%2;
						showFace(canvas, img0);
					}
				});
				ap.add(b0, 420, 0);
				
				Button b1 = new Button("eyebrows");
				b1.addClickHandler(new ClickHandler() {
					@Override
					public void onClick(ClickEvent event) {
						eyebrowsIndex = (eyebrowsIndex+1)%2;
						showFace(canvas, img0);
					}
				});
				ap.add(b1, 420, 30);

				Button b2 = new Button("makeup");
				b2.addClickHandler(new ClickHandler() {
					@Override
					public void onClick(ClickEvent event) {
						makeupIndex = (makeupIndex+1)%2;
						showFace(canvas, img0);
					}
				});
				ap.add(b2, 420, 60);
				
				Button b3 = new Button("eyes");
				b3.addClickHandler(new ClickHandler() {
					@Override
					public void onClick(ClickEvent event) {
						eyesIndex = (eyesIndex+1)%4;
						showFace(canvas, img0);
					}
				});
				ap.add(b3, 420, 90);
				
				Button b4 = new Button("mouth");
				b4.addClickHandler(new ClickHandler() {
					@Override
					public void onClick(ClickEvent event) {
						mouthIndex = (mouthIndex+1)%2;
						showFace(canvas, img0);
					}
				});
				ap.add(b4, 420, 120);
				
			}

		});
		
		ap.add(dp,0,0);
		dp.add(canvas);
	}
	
	private void showFace(GWTCanvas canvas, ImageElement img) {

		canvas.clear();
		
		canvas.translate(0, 0);
		canvas.scale(1, 1);
		
		// skull
		canvas.drawImage(img, 15, 10, 290, 350, 50, 50, 290, 350);
		
		// eyebrows
		canvas.drawImage(img, 725, 10 + eyebrowsIndex*100, 180, 80, 130, 155, 180, 80);
		
		// hair
//		canvas.drawImage(img, 320, 10 + hairIndex*510, 350, 350, -3, 50, 350, 350);
		canvas.drawImage(img, 320, 10 + hairIndex*510, 350, 350, -5, 49, 350, 350);
		
		// eyes make up
		canvas.drawImage(img, 920, 10 + makeupIndex*100, 180, 80, 133, 172, 180, 80);
		
		// eyes
		canvas.drawImage(img, 1115, 10 + eyesIndex*100, 180, 80, 132, 170, 180, 80);
		
		// cheeks
		canvas.drawImage(img, 1310, 10, 180, 80, 135, 210, 180, 80);
		
		// mouth
		canvas.drawImage(img, 1505, 10 + mouthIndex*100, 80, 80, 185, 260, 80, 80);
		
		// ear
		canvas.drawImage(img, 1600, 10, 80, 80, 75, 205, 80, 80);
		
		// nose
		canvas.drawImage(img, 1695, 10, 80, 80, 197, 222, 80, 80);
		
	}
}

